/**
 * Created by MD-3 on 2017/5/25.
 */

function openDeviceInfo(deviceid, alarmCheck) {
    var infoData = infoWinow_mock;
    var id, type, name, marker, workState, alarmState, updateState;
    var device = getDeviceById(deviceid);
    id = deviceid;
    type = device.type;
    name = device.name;
    marker = device.marker;
    workState = device.workState;
    alarmState = device.alarmState;
    updateState = device.updateState;

    var alarmActive = '', basicActive = '';
    if (alarmCheck) {
        basicActive = ' class="tab-pane fade"';
        alarmActive = ' class="tab-pane fade in active"';
    } else {
        basicActive = ' class="tab-pane fade in active"';
        alarmActive = ' class="tab-pane fade"';
    }

    var title = createInfoTitle(name);

    var content = '<div style="width: 400px;height: 220px;overflow:auto;">'
        + createTabStr(infoData.thead, alarmCheck)

        + '<div id="myTabContent" class="tab-content">'
        + '<div ' + basicActive + ' id="mybasic-info">'
        + '    <table class="table table-hover">'
        + '        <tbody>' + createBasicInfo(infoData.basicInfo) + '</tbody>'
        + '    </table>'
        + '</div>'

        + '<div ' + alarmActive + ' id="myalarm-info">'
        + '    <table class="table table-hover">'
        + '        <thead><tr><th>Id</th><th>名称</th><th>时间</th><th>处理</th></tr></thead>'
        + '        <tbody>' + createAlarmInfo(id, infoData.alarmInfo) + '</tbody>'
        + '    </table>'
        + '</div>'

        + '<div class="tab-pane fade" id="mydevice-state">'
        + '    <table class="table table-hover">'
        + '        <tbody>' + createDeviceState(infoData.devicestate) + '</tbody>'
        + '    </table>'
        + '</div>'

        + '<div class="tab-pane fade" id="mydevice-config">'
        + '    <table class="table table-bordered table-hover">'
        + '        <tbody>' + createDeviceConfig(infoData.deviceconfig) + '</tbody>'
        + '    </table>'
        + '</div>'

        + '</div>'
        + '</div>';

    var infoWindow = new AMap.InfoWindow({
        isCustom: true,                                              //使用自定义窗体
        content: createInfoWindow(title, content),
        //content:"map/infoTab.html",
        offset: new AMap.Pixel(16, -45)
    });
    infoWindow.open(map, marker.getPosition());
    map.panTo(marker.getPosition());
}

function createInfoTitle(titletext) {
    return '<span class="infotitle">' + titletext + '</span>';
}

function createTabStr(thead, alarmCheck) {
    var basicActive = '';
    var alarmActive = '';
    if (alarmCheck) {
        alarmActive = ' class="active"';
    } else {
        basicActive = ' class="active"';
    }
    var str =
        '<ul id="myTab" class="nav nav-tabs nav-justified" style="background: #f0f0f0">'
        + '    <li ' + basicActive + '><a href="#mybasic-info" data-toggle="tab">' + thead[0] + '</a></li>'       //基本信息
        + '    <li id="myalarm-infoli"' + alarmActive + '><a href="#myalarm-info" data-toggle="tab">' + thead[1] + '</a></li>'     //报警显示
        + '    <li><a href="#mydevice-state" data-toggle="tab">' + thead[2] + '</a></li>'                     //设备状态
        + '    <li><a href="#mydevice-config" data-toggle="tab">' + thead[3] + '</a></li>'                    //设备配置
        + '</ul>';
    return str;
}

function createBasicInfo(basicInfo) {
    return '<tr><td>ID：' + basicInfo.deviceId + '</td><td>出厂编号：' + basicInfo.productId + '</td></tr>'
        + '<tr><td>厂商：' + basicInfo.productor + '</td><td>出厂版本：' + basicInfo.productVersion + '</td></tr>'
        + '<tr><td>安装人员：' + basicInfo.installer + '</td><td>安装时间：' + basicInfo.installTime + '</td></tr>'
        + '<tr><td colspan="2">安装位置：' + basicInfo.installArea + '>' + basicInfo.installPreDevice + '>' + basicInfo.installPosition + '</td></tr>';
}

function createAlarmInfo(id, alarmInfo) {
    if (!alarmInfo || 0 == alarmInfo.length) {
        return "暂无报警";
    }
    var str = "", strTmp = "";
    for (var i in alarmInfo) {
        var alarminfo = alarmInfo[i];
        var id = alarminfo.id;
        var name = alarminfo.name;
        var alarmId = alarminfo.alarmId;
        var alarmTime = alarminfo.alarmTime;
        var alarmState = alarminfo.alarmState;
        var alarmType = alarminfo.alarmType;
        var audioUrl = alarminfo.audioUrl;

        if ("1" == alarmState) {
            var tdid = "alarmtog"+alarmId;
            strTmp = '<td id="'+tdid+'"><button type="button" class="btn btn-primary btn-sm active"'
                + 'deviceId="' + id + '" alarmId="' + alarmId + '" audioUrl="' + audioUrl + '" onclick="alarmtoggle(this)">报警处理</button></td>';
        } else {
            strTmp = '<td>' + alarmType + '</td>';
        }
        str += '<tr><td>' + alarmId + '</td>'
            + '<td>' + name + '</td>'
            + '<td>' + alarmTime + '</td>'
            + strTmp
            + '</tr>';
    }
    return str;
}

function createDeviceState(deviceState) {
    return '<tr><td>工作状态：' + deviceState.workState + '</td></tr>'
        + '<tr><td>软件更新：' + deviceState.updateState + '</td></tr>'
        + '<tr><td>网路类型：' + deviceState.netType + '</td></tr>'
        + '<tr><td>网络状态：' + deviceState.netState + '</td></tr>'
        + '<tr><td>设备电量：' + deviceState.power + '</td></tr>';
}

function createDeviceConfig(deviceconfig) {
    return '<tr><td>当前模式：' + deviceconfig.configMode + '</td></tr>'
        + '<tr><td>最近报警时间：' + deviceconfig.lastAlarmTime + '</td></tr>'
        + '<tr><td>最近上传时间：' + deviceconfig.lastUpdateTime + '</td></tr>'
        + '<tr><td><button type="button" class="btn btn-primary active col-sm-5" onclick="devicetoggle(this)">一键撤防</button>'
        + '<button type="button" style="float: right;" class="btn btn-primary active col-sm-5" onclick="listenertoggle(this)">启动监听</button></td></tr>';
}

function alarmtoggle(thisitem) {
    var btn = $(thisitem);
    var deviceId = btn.attr("deviceId");
    var alarmId = btn.attr("alarmId");
    var audioUrl = btn.attr("audioUrl");

    var contentstr = getContentstr(deviceId, alarmId, audioUrl);
    openLayer('报警处理', contentstr);
    stop_bjAlarm();                                                             //关闭报警音乐提醒
}

function devicetoggle(thisitem) {
    var btn = $(thisitem);
    var status;
    if (btn.hasClass('active')) {
        status = "一键布防";
        btn.removeClass('active');
    } else {
        status = "一键撤防";
        btn.addClass('active');
    }
    btn.text(status);
}

function listenertoggle(thisitem) {
    var btn = $(thisitem);
    var status;
    if (btn.hasClass('active')) {
        status = "关闭监听";
        btn.removeClass('active');
    } else {
        status = "启动监听";
        btn.addClass('active');
        //弹窗，保存文件？
    }
    btn.text(status);
}

function getContentstr(deviceId, alarmId, audioUrl) {
    var contentstr =
        '<audio controls style="margin-left:20px">'
        + '<source src=' + audioUrl + ' type="audio/mpeg">'
        + 'Your browser does not support this audio format.'
        + '</audio>'
        + '<div style="margin-top:10px">'
        + '    <form class="form-horizontal col-sm-12" role="form">'
        + '        <div class="form-group">'
        + '            <label class="col-sm-2 control-label">处理</label>'
        + '            <div class="col-sm-10">'
        + '                <div class="col-sm-4"><input type="radio" name="optionsRadios" id="optionsRadios0" value="option0">报警</div>'
        + '                <div class="col-sm-4"><input type="radio" name="optionsRadios" id="optionsRadios1" value="option1">爆破</div>'
        + '                <div class="col-sm-4"><input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">下雨</div>'
        + '                <div class="col-sm-4"><input type="radio" name="optionsRadios" id="optionsRadios1" value="option3">打雷</div>'
        + '                <div class="col-sm-4"><input type="radio" name="optionsRadios" id="optionsRadios3" value="option4">其他</div>'
        + '            </div>'
        + '        </div>'
        + '        <div class="form-group">'
        + '            <label class="col-sm-2 control-label">描述</label>'
        + '            <div class="col-sm-10">'
        + '                <textarea class="form-control" id="alarmnote" placeholder="警情描述"></textarea>'
        + '            </div>'
        + '        </div>'
        + '    </form>'
        + '</div>'
        + '<div style="margin: 0 auto;width:90%;">'
        + '    <button type="submit" class="btn btn-primary btn-block" deviceId="' + deviceId + '" alarmId="' + alarmId + '" onclick="checkAlarm(this)">确认</button>'
        + '</div>';
    return contentstr;
}

function checkAlarm(thisitem) {
    var radioVal = $('input:radio[name="optionsRadios"]:checked').val();
    if (!radioVal) {
        alert("请处理报警！");
        return;
    }
    var radioText = getRadioText(radioVal);
    var text = document.getElementById('alarmnote').value;
    if("" != text){ text = "("+text+")"}
//    console.log("radioText:"+radioText+"====text:" + text);

    //do something
    var btn = $(thisitem);
    var deviceId = btn.attr("deviceId");
    var device = getDeviceById(deviceId);
    var alarmId = btn.attr("alarmId");

    var type = device.type;
    var workState = device.workState;
    var alarmState = device.alarmState = "2";
    var updateState = device.updateState;
    var alarmMarker = device.marker;
    var icon = getMarkerImg(type, workState, alarmState, updateState);                //报警图标、颜色
    alarmMarker.setIcon(icon);
    var strokeColor = getStrokeColor(workState, alarmState, updateState);
    device.polyline.setOptions({strokeColor: strokeColor});
    device.circle.setOptions({strokeColor: strokeColor});
    device.circle.setOptions({fillColor: strokeColor});

    var ulId = 'marquee-content-items';
    var liId = alarmId;
    deleteliById(ulId, liId);                                                   //关闭跑马灯提醒

    layer.closeAll();                                                          //关闭layer弹窗

    var tdid = "alarmtog"+alarmId;
    document.getElementById(tdid).innerHTML = '<td >'+radioText+text+'</td>';
}


function getRadioText(radioVal) {
    var str = "";
    switch(radioVal){
        case "option0":
            str = "报警";
            break;
        case "option1":
            str = "爆破";
            break;
        case "option2":
            str = "下雨";
            break;
        case "option3":
            str = "打雷";
            break;
        case "option4":
            str = "其他";
            break;
        default:
            str = "其他";
    }
    return str;
}

function openLayer(title, contentstr) {
    layer.open({
        type: 1,
        title: title,
        area: ['400px', '300px'],
        shadeClose: false,               //点击遮罩关闭
        btnAlign: 'c',                   //按钮居中
        content: '\<\div style="margin:10px;">' + contentstr + '\<\/div>',
        closeBtn: 0,
        /*cancel: function(){
         //右上角关闭回调
         return false;                //开启该代码可禁止点击该按钮关闭
         }*/
    });
}


//构建自定义信息窗体
function createInfoWindow(title, content) {
    var info = document.createElement("div");
    info.className = "info";

    //可以通过下面的方式修改自定义窗体的宽高
    //info.style.width = "400px";
    // 定义顶部标题
    var top = document.createElement("div");
    var titleD = document.createElement("div");
    var closeX = document.createElement("img");
    top.className = "info-top";
    titleD.innerHTML = title;
    closeX.src = "http://webapi.amap.com/images/close2.gif";
    closeX.onclick = closeInfoWindow;

    top.appendChild(titleD);
    top.appendChild(closeX);
    info.appendChild(top);

    // 定义中部内容
    var middle = document.createElement("div");
    middle.className = "info-middle";
    middle.style.backgroundColor = 'white';
    middle.innerHTML = content;
    info.appendChild(middle);

    // 定义底部内容
    var bottom = document.createElement("div");
    bottom.className = "info-bottom";
    bottom.style.position = 'relative';
    bottom.style.top = '0px';
    bottom.style.margin = '0 auto';
    var sharp = document.createElement("img");
    sharp.src = "http://webapi.amap.com/images/sharp.png";
    bottom.appendChild(sharp);
    info.appendChild(bottom);
    return info;
}

//关闭信息窗体
function closeInfoWindow() {
    map.clearInfoWindow();
}